<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>
<body>
<div id="app">
    <label>
        <input type="checkbox" name="checkAll" @change="checkAllTodo"> 全选
    </label>
    <hr>
    <label v-for="(item, index) in hobbyList" :key="index">
        <input type="checkbox" :checked="flag" name="item" :value="item"> {{item}}
    </label>
    <hr>
</div>
<script>
    new Vue({
        el: '#app',
        data: {
            checkAll: false,
            selected: [],
            flag: false,
            hobbyList: [
                '吃饭',
                '睡觉',
                '打豆豆'
            ]
        },
        methods: {

            //全选or全不选
            checkAllTodo(e) {
                    this.flag = e.target.checked;
            },
        }
    })
</script>
</body>
</html>